define([
  'fe-header'
], (...vue) => {

  const [
    FeHeader
  ] = vue;

  const Register = {
    template: `<main>

      <!--
      <fe-header :btnData='btnData'>        
      </fe-header>
      -->

      <article class="am-container am-padding-sm am-margin-vertical dg-art">
        <div class="am-g">
          <!-- 注册内容 -->
          <div class="am-u-md-12">
            <form class="am-form am-form-horizontal">
              <fieldset>
                <legend class="am-text-xxl">大赛帐号注册</legend>

                <!-- 注意事项说明 -->
                <div class="">
                  <h3>注意事项说明：</h3>
                  <p>1.大赛帐号需绑定三维家帐号才能报名</p>
                  <p>2.三维家帐号可日后再绑定</p>
                  <p>3.三维家帐号用于验证大赛资格</p>
                </div>

                <hr data-am-widget="divider" style="" class="am-divider am-divider-default" />

                <!-- 头像 -->
                <div class="am-form-group am-form-group-sm am-form-file">
                  <label class="am-u-sm-12 am-u-md-2 am-form-label" for="">头像</label>
                  <div class="am-u-sm-6 am-u-md-5">
                    <button type="button" class="am-btn am-btn-default am-btn-sm">
                      <i class="am-icon-cloud-upload"></i>上传你的头像
                    </button>
                    <input type="file" multiple>
                  </div>
                  <div class="am-u-sm-6 am-u-md-5">
                    头像缩略图
                  </div>
                <div class="am-u-end"></div>
                </div>

                <!-- 姓名 -->
                <div class="am-form-group am-form-group-sm">
                  <label class="am-u-sm-12 am-u-md-2 am-form-label" for="">姓名</label>
                  <div class="am-u-sm-12 am-u-md-5">
                    <input class="am-form-field" type="text" placeholder="姓名">
                    <small class="am-text-danger">必填</small>
                  </div>
                  <div class="am-u-end"></div>
                </div>

                <!-- 性别
                <div class="am-form-group am-form-group-sm">
                  <label class="am-u-sm-2 am-form-label" for="">姓别</label>
                  <div class="am-u-sm-5">
                    <label class="am-radio-inline">
                      <input class="" type="radio" name="docInlineRadio">男
                    </label>
                    <label class="am-radio-inline">
                      <input class="" type="radio" name="docInlineRadio">女
                    </label>
                  </div>
                  <div class="am-u-end"></div>
                </div>
                -->

                <!-- 出生年月
                <div class="am-form-group am-form-group-sm">
                  <label class="am-u-sm-2 am-form-label" for="">出生年月</label>
                  <div class="am-u-sm-5">
                    <input type="text" class="am-form-field" placeholder="日历组件" data-am-datepicker="{format: 'yyyy-mm', viewMode: 'years', minViewMode: 'months'}" readonly required />
                  </div>
                  <div class="am-u-end"></div>
                </div>
                -->

                <!-- 邮箱
                <div class="am-form-group am-form-group-sm">
                  <label class="am-u-sm-2 am-form-label" for="">邮箱</label>
                  <div class="am-u-sm-5">
                    <input class="am-form-field" type="email" placeholder="邮箱">
                  </div>
                  <div class="am-u-end"></div>
                </div>
                -->

                <!-- 手机 -->
                <div class="am-form-group am-form-group-sm">
                  <label class="am-u-sm-12 am-u-md-2 am-form-label" for="">手机</label>
                  <div class="am-u-sm-12 am-u-md-5">
                    <input class="am-form-field" type="tel" placeholder="手机">
                    <small class="am-text-danger">必填，手机作为你大赛的登录帐号</small>
                  </div>
                  <div class="am-u-end"></div>
                </div>

                <!-- password -->
                <div class="am-form-group am-form-group-sm">
                  <label class="am-u-sm-12 am-u-md-2 am-form-label" for="">密码</label>
                  <div class="am-u-sm-12 am-u-md-5">
                    <input class="am-form-field" type="password" placeholder="密码">
                  </div>
                  <div class="am-u-end"></div>
                </div>

                <!-- repassword -->
                <div class="am-form-group am-form-group-sm">
                  <label class="am-u-sm-12 am-u-md-2 am-form-label" for="">确认密码</label>
                  <div class="am-u-sm-12 am-u-md-5">
                    <input class="am-form-field" type="password" placeholder="确认密码">
                  </div>
                  <div class="am-u-end"></div>
                </div>

                <!-- 门店信息 -->
                <div class="am-form-group am-form-group-sm">
                  <label class="am-u-sm-12 am-u-md-2 am-form-label" for="">所属门店</label>
                  <div class="am-u-sm-12 am-u-md-3">
                    <select class="am-form-field" name="" id="" data-am-selected required>
                      <option value="a">所属地区</option>
                      <option value="a">1</option>
                      <option value="s">2</option>
                    </select>
                  </div>
                  <div class="am-u-sm-12 am-u-md-3">
                    <select class="am-form-field" name="" id="" data-am-selected required>
                      <option value="q1">所属经销商</option>
                      <option value="q1">a</option>
                      <option value="q1">b</option>
                    </select>
                  </div>
                  <div class="am-u-sm-12 am-u-md-3">
                    <select class="am-form-field" name="" id="" data-am-selected required>
                      <option value="q1">所属门店</option>
                      <option value="q1">a</option>
                      <option value="q1">b</option>
                    </select>
                  </div>
                  <div class="am-u-end"></div>
                </div>

                <!-- 三维家 -->
                <div class="am-form-group am-form-group-sm">
                  <label class="am-u-sm-12 am-u-md-2 am-form-label" for="">三维家帐号</label>
                  <div class="am-u-sm-12 am-u-md-5">
                    <input class="am-form-field" type="text" placeholder="三维家帐号">
                    <small class="am-text-warning">可选</small>
                  </div>
                  <div class="am-u-sm-6 am-u-md-2">
                    <input class="am-form-field" type="text" placeholder="输入验证码">
                  </div>
                  <div class="am-u-sm-6 am-u-md-3">
                    <button type="button" class="am-btn am-btn-default am-btn-sm">获取验证码</button>
                  </div>
                  <div class="am-u-end"></div>
                </div>

                <!-- 自我介绍 -->
                <div class="am-form-group am-form-group-sm">
                  <label class="am-u-sm-12 am-u-md-2 am-form-label" for="">自我介绍</label>
                  <div class="am-u-sm-12 am-u-md-10">
                    <textarea class="am-form-field" name="" id="" rows="5" placeholder="几句话介绍自己"></textarea>
                  </div>
                  <div class="am-u-end"></div>
                </div>

                <!-- 提交表单 -->
                <div class="am-form-group am-form-group-sm">
                  <div class="am-u-sm-12 am-u-md-10 am-u-md-offset-2">
                    <router-link to='/personal' class="am-btn am-btn-default am-btn-sm">确认提交</router-link>
                    <!-- <button type="submit" class="am-btn am-btn-default am-btn-sm" >确认提交</button> -->
                    <button type="reset" class="am-btn am-btn-default am-btn-sm">重置</button>
                  </div>
                </div>
              </fieldset>
            </form>
          </div>
        </div>
      </article>

    </main>`.replace(/[\r\n]/g, ''),
    data() {
      return {
        currentRoute: window.location.pathname,
        btnData: [
          {
            name: '返回首页',
            href: '/'
          }
        ]
      }
    },
    components: {
      FeHeader
    },
    mounted() {
      this.currentRoute.indexOf('register')
    }
  }

  return Register;
});